import { useRef } from "react";

import { LoadingAnimation } from "~/components/deer-flow/loading-animation";
import { Markdown } from "~/components/deer-flow/markdown";
import { InterviewStore } from "~/core/store";
import { cn } from "~/lib/utils";

export function JdGeneratorBlock({
  className,
  messageId,
}: {
  className?: string;
  messageId: string;
}) {
  const message = InterviewStore.useMessage(messageId);
  const contentRef = useRef<HTMLDivElement>(null);

  return (
    <div ref={contentRef} className={cn("w-full pt-4 pb-8", className)}>
      <Markdown animated checkLinkCredibility>
        {message?.content}
      </Markdown>
      {message?.isStreaming && <LoadingAnimation className="my-12" />}
    </div>
  );
}
